<template>
    <f7-page class="page-news-type">
        <f7-navbar>
            <f7-nav-left sliding>
                <f7-link icon-fa="arrow-left" back></f7-link>
            </f7-nav-left>
            <f7-nav-center>分类选择</f7-nav-center>
            <f7-nav-right>
                <f7-link @click="publish">发布</f7-link>
            </f7-nav-right>
        </f7-navbar>
        <div class="main">
            <f7-list form>
                <f7-list-group>
                    <f7-list-item title="分类选择" group-title></f7-list-item>
                    <f7-list-item radio name="type" value="0" title="体育" checked></f7-list-item>
                    <f7-list-item radio name="type" value="1" title="娱乐"></f7-list-item>
                    <f7-list-item radio name="type" value="2" title="游戏"></f7-list-item>
                </f7-list-group>
            </f7-list>
        </div>
    </f7-page>
</template>

<style lang="scss">
    @import "../../assets/css/common.scss";
    .page-news-type {
        form {
            &.list-block {
                margin-top: 0;
            }
        }
    }
</style>

<script>
    export default {
        methods: {
            publish() {
                this.$f7.alert(
                    "发布成功",
                    "<i class='icon fa fa-check-circle-o' style='font-size: 35px;'></i>",
                    () => {
                        this.$router.load({
                            url: '/news/detail/'
                        })
                    }
                )
            }
        }
    }
</script>